import { App } from 'vue'
import { createI18n } from 'vue-i18n'
import ElementPlus from 'element-plus'
import elZH from 'element-plus/es/locale/lang/zh-cn'
import elEN from 'element-plus/es/locale/lang/en'
import zh from './zh'
import en from './en'
import { ELocale } from '@/enums/locale'

const messages = {
  zh_CN: {
    ...zh,
    ...elZH,
  },
  en_US: {
    ...en,
    ...elEN,
  },
}

/**
 * 获取当前语言
 * @returns zh_CN | en_US ...
 */
export const getLanguage = (): ELocale => {
  // const language = useStorage<ELocale>('language', ELocale.zh_CN);
  const language = ELocale.zh_CN
  if (language) {
    return language
  }
  // 不存在 获取系统语言
  // language = window.navigator.language.toLowerCase()
  // const locales = Object.keys(messages)
  // for (const locale of locales) {
  //   if (language.indexOf(locale) > -1) {
  //     return locale as ELocale
  //   }
  // }
  return ELocale.zh_CN
}

const i18n = createI18n({
  globalInjection: true, // 全局注册 $t 方法, 默认true
  allowComposition: true,
  legacy: false,
  locale: getLanguage(),
  fallbackLocale: ELocale.zh_CN,
  messages,
})

export default function useVueI18n(app: App) {
  app.use(ElementPlus, {
    locale: elZH,
  })
  app.use(i18n)
}
